<template>
  <div>
    <a-modal
      :visible.sync="visible"
      v-bind="$attrs"
      v-on="$listeners"
      :maskClosable="false"
      :footer="null"
      width="900px"
      :title="model.text"
      wrapClassName="add-modal-container"
      @cancel="closeModal()"
    >
      <div class="curve-modal-body">
        <a-form-model ref="ruleForm" :model="form" :rules="rules">
          <div class="sub-title">基本信息</div>
          <a-divider />
          <a-form-model-item label="上级公司" prop="pid">
            <depart-popup
              placeholder="请选择上级公司"
              url="/mdata/organization/getTreeSysOrganization"
              v-model="form.pid"
            ></depart-popup>
          </a-form-model-item>
          <a-form-model-item ref="proName" label="项目名称" prop="proName">
            <a-input
              v-model="form.proName"
              placeholder="请输入项目名称"
              :maxLength="255"
            />
          </a-form-model-item>
          <a-row :gutter="0">
            <a-col :span="12">
              <a-form-model-item label="项目状态" prop="proStatus">
                <a-select
                  :getPopupContainer="selectContainer"
                  showSearch
                  :filter-option="filterOption"
                  v-model="form.proStatus"
                  placeholder="请选择项目状态"
                  allowClear
                >
                  <a-select-option
                    :value="item.dicItemCode"
                    v-for="(item, index) in roadGradeSource"
                    :key="index"
                  >
                    {{ item.dicItemName }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <a-form-model-item ref="engType" label="工程类型" prop="engType">
                <a-select
                  :getPopupContainer="selectContainer"
                  showSearch
                  :filter-option="filterOption"
                  v-model="form.engType"
                  placeholder="请选择工程类型"
                >
                  <a-select-option
                    :value="item.dicItemCode"
                    v-for="(item, index) in engTypeSource"
                    :key="index"
                  >
                    {{ item.dicItemName }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row :gutter="0">
            <a-col :span="12">
              <a-form-model-item label="计划开工日期" prop="startDate">
                <a-date-picker
                  :getCalendarContainer="selectContainer"
                  style="width: 100%"
                  v-model="form.startDate"
                  format="YYYY-MM-DD"
                  valueFormat="YYYY-MM-DD"
                  placeholder="请选择计划开工日期"
                  :disabled-date="disabledStartDate"
                />
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <a-form-model-item label="计划交工日期" prop="endDate">
                <a-date-picker
                  :getCalendarContainer="selectContainer"
                  style="width: 100%"
                  v-model="form.endDate"
                  format="YYYY-MM-DD"
                  valueFormat="YYYY-MM-DD"
                  placeholder="请选择计划交工日期"
                  :disabled-date="disabledEndDate"
                />
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row :gutter="0">
            <a-col :span="12">
              <a-form-model-item label="实际开工日期" prop="realityStartDate">
                <a-date-picker
                  style="width: 100%"
                  v-model="form.realityStartDate"
                  disabled
                  placeholder=""
                />
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <a-form-model-item label="实际交工日期" prop="realityEndDate">
                <a-date-picker
                  style="width: 100%"
                  v-model="form.realityEndDate"
                  disabled
                  placeholder=""
                />
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row :gutter="0">
            <a-col :span="12">
              <a-form-model-item label="归属公司" prop="companyCode">
                <a-select
                  :getPopupContainer="selectContainer"
                  allowClear
                  showSearch
                  :filter-option="filterOption"
                  v-model="form.companyCode"
                  placeholder="请选择归属公司"
                >
                  <a-select-option
                    :value="item.orgCode"
                    v-for="(item, index) in companySource"
                    :key="index"
                  >
                    {{ item.orgName }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <a-form-model-item label="项目属性">
                <a-select
                  :getPopupContainer="selectContainer"
                  showSearch
                  :filter-option="filterOption"
                  v-model="form.proType"
                  placeholder="请选择项目属性"
                >
                  <a-select-option
                    :value="item.dicItemCode"
                    v-for="(item, index) in projectTypeSource"
                    :key="index"
                  >
                    {{ item.dicItemName }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row :gutter="0">
            <a-col :span="12">
              <!--投资金额 -->
              <a-form-model-item prop="roadMoney" label="投资金额(万元)">
                <a-input
                  v-model="form.roadMoney"
                  placeholder="请输入投资金额"
                  :maxLength="14"
                  @blur="roadMoneyBlur($event)"
                />
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <!-- 投资规模 -->
              <a-form-model-item label="投资规模">
                <a-input v-model="form.raodMoneyScale" disabled />
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row :gutter="0">
            <a-col :span="12">
              <a-form-model-item label="区位" prop="workArea">
                <a-select
                  :getPopupContainer="selectContainer"
                  showSearch
                  :filter-option="filterOption"
                  v-model="form.workArea"
                  placeholder="请选择区位"
                >
                  <a-select-option
                    :value="item.dicItemCode"
                    v-for="(item, index) in workAreaSource"
                    :key="index"
                  >
                    {{ item.dicItemName }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <a-form-model-item ref="sort" label="排序" prop="sort">
                <a-input
                  v-model="form.sort"
                  type="number"
                  placeholder="请输入排序"
                  :maxLength="11"
                />
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row :gutter="0">
            <a-col :span="12">
              <!--项目管理负责人 -->
              <a-form-model-item
                ref="contacts"
                label="项目管理负责人"
                prop="contacts"
              >
                <a-input
                  v-model="form.contacts"
                  placeholder="请输入项目管理负责人"
                  :maxLength="50"
                />
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <!--手机号 -->
              <a-form-model-item
                ref="contactsPhone"
                label="手机号"
                prop="contactsPhone"
              >
                <a-input
                  v-model="form.contactsPhone"
                  placeholder="请输入手机号"
                />
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row :gutter="0">
            <a-col :span="12">
              <a-form-model-item label="项目流程">
                <a-select
                  :getPopupContainer="selectContainer"
                  v-model="form.flowChart"
                  placeholder="请选择项目流程"
                  allowClear
                >
                  <a-select-option
                    :value="item.remark"
                    v-for="(item, index) in flowSource"
                    :key="index"
                  >
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <a-form-model-item label="集团工程技术部分管主任">
                <a-input
                  v-model="form.groupDirector"
                  placeholder="请输入集团工程技术部分管主任"
                  :maxLength="255"
                />
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row :gutter="0">
            <a-col :span="12">
              <a-form-model-item label="集团战略投资部分管主任">
                <a-input
                  v-model="form.strategicInvestmentDirector"
                  placeholder="请输入集团战略投资部分管主任"
                  :maxLength="255"
                />
              </a-form-model-item>
            </a-col>
            <!-- <a-col :span="12">
              <a-form-model-item label="建设单位" prop="constructionUnit">
                <a-input
                  v-model="form.constructionUnit"
                  placeholder="请输入建设单位"
                  :maxLength="255"
                />
              </a-form-model-item>
            </a-col> -->
          </a-row>
          <!--项目简介 -->
          <a-form-model-item
            ref="introduction"
            label="项目简介"
            prop="introduction"
          >
            <a-input
              v-model="form.introduction"
              placeholder="请输入项目简介"
              type="textarea"
              style="height: 100px"
            />
          </a-form-model-item>
          <a-form-model-item ref="provinceCode" label="项目所在地">
            <a-row :gutter="20">
              <a-col :span="12">
                <a-select
                  :getPopupContainer="selectContainer"
                  v-model="form.provinceCode"
                  placeholder="请选择省份"
                  @change="provinceChange"
                >
                  <a-select-option
                    :value="item.code"
                    v-for="(item, index) in provinceSource"
                    :key="index"
                  >
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-col>
              <a-col :span="12">
                <a-select
                  :getPopupContainer="selectContainer"
                  v-model="form.cityCode"
                  placeholder="请选择城市"
                  @change="cityChange"
                >
                  <a-select-option
                    :value="item.code"
                    v-for="(item, index) in citySource"
                    :key="index"
                  >
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-col>
              <!-- <a-col :span="8">
                <a-select
                  :getPopupContainer="selectContainer"
                  v-model="form.areaCode"
                  placeholder="请选择区县"
                >
                  <a-select-option
                    :value="item.code"
                    v-for="(item, index) in areaSource"
                    :key="index"
                  >
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-col> -->
            </a-row>
          </a-form-model-item>
          <a-form-model-item label="详细地址" prop="address">
            <a-input v-model="form.address" placeholder="请输入详细地址" />
          </a-form-model-item>
          <!--经纬度坐标 -->
          <!-- <a-form-model-item ref="geox" label="经纬度坐标" prop="geox">
            <a-row :gutter="20">
              <a-col :span="12">
                <a-input
                  v-model="form.geox"
                  disabled
                  placeholder="请选择经纬度坐标"
                ></a-input>
              </a-col>
              <a-col :span="12">
                <a-input
                  v-model="form.geoy"
                  disabled
                  placeholder="请选择经纬度坐标"
                ></a-input>
              </a-col>
            </a-row>
            <div class="map-container">
              <div id="project-map"></div>
              <div class="search-wrap">
                <a-radio-group name="radioGroup" v-model="map.type">
                  <a-radio :value="1">按关键字搜索</a-radio>
                  <a-radio :value="2">按坐标搜索</a-radio>
                </a-radio-group>
                <div class="input-container">
                  <div class="input-body">
                    <a-input
                      v-if="map.type == 1"
                      placeholder="关键字搜索"
                      v-model="map.keyWord"
                      id="tipinput"
                    />
                    <template v-if="map.type == 2">
                      <a-input placeholder="请输入经度" v-model="map.geox" />
                      <div style="line-height: 30px">,</div>
                      <a-input placeholder="请输入纬度" v-model="map.geoy" />
                    </template>
                  </div>
                  <div class="search" @click="serachMap()">
                    <a-icon
                      type="search"
                      :style="{
                        fontSize: '20px',
                        color: '#fff',
                      }"
                    />
                  </div>
                </div>
              </div>
            </div>
          </a-form-model-item> -->
          <!--项目图片 -->
          <a-form-model-item label="项目图片">
            <UploadImg
              :record="upLoadImgData"
              :config="upLoadImgConfigData"
              v-model="form.proImage"
              @change="
                (e) => {
                  handleChange(e);
                }
              "
            />
          </a-form-model-item>
          <div class="sub-title">其他信息</div>
          <a-divider />
          <a-row :gutter="0">
            <a-col :span="12">
              <a-form-model-item label="项目级别">
                <a-select
                  placeholder="请选择"
                  v-model="form.projectLevel"
                  showSearch
                  allowClear
                  :filter-option="filterOption"
                >
                  <a-select-option
                    :value="item.dicItemCode"
                    v-for="item in levelSoucer"
                    :key="item.dicItemCode"
                  >
                    {{ item.dicItemName }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <a-form-model-item label="资金来源">
                <a-select
                  placeholder="请选择"
                  v-model="form.fundingSource"
                  showSearch
                  allowClear
                  :filter-option="filterOption"
                >
                  <a-select-option
                    :value="item.dicItemCode"
                    v-for="item in fundingSource"
                    :key="item.dicItemCode"
                  >
                    {{ item.dicItemName }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
              <!-- <a-form-model-item label="建设性质">
                <a-select
                  placeholder="请选择"
                  v-model="form.constructionNature"
                  showSearch
                  allowClear
                  :filter-option="filterOption"
                >
                  <a-select-option
                    :value="item.dicItemCode"
                    v-for="item in natureSoucer"
                    :key="item.dicItemCode"
                  >
                    {{ item.dicItemName }}
                  </a-select-option>
                </a-select>
              </a-form-model-item> -->
            </a-col>
          </a-row>

          <a-row :gutter="0">
            <a-col :span="12">
              <a-form-model-item label="项目单位">
                <a-select
                  placeholder="请选择"
                  v-model="form.projectUnit"
                  showSearch
                  allowClear
                  :filter-option="filterOption"
                >
                  <a-select-option
                    :value="item.dicItemCode"
                    v-for="item in unitSoucer"
                    :key="item.dicItemCode"
                  >
                    {{ item.dicItemName }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <a-form-model-item label="管理部门">
                <a-select
                  placeholder="请选择"
                  v-model="form.managementDepartment"
                  showSearch
                  allowClear
                  :filter-option="filterOption"
                >
                  <a-select-option
                    :value="item.dicItemCode"
                    v-for="item in departmentSource"
                    :key="item.dicItemCode"
                  >
                    {{ item.dicItemName }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-form-model-item label="建设规模">
            <a-textarea
              v-model.trim="form.constructionScale"
              placeholder="请输入"
              :rows="4"
            />
          </a-form-model-item>
        </a-form-model>
      </div>
      <div class="curve-modal-footer">
        <a-button type="default" @click="closeModal()">取消 </a-button>
        <a-button type="primary" :loading="loading" @click="onSubmit">
          确定
        </a-button>
      </div>
    </a-modal>
  </div>
</template>

<script>
//新增项目弹窗
import { axios } from "@/utils/request";
import AMapLoader from "@amap/amap-jsapi-loader";
window._AMapSecurityConfig = {
  securityJsCode: "ecfcb87ee130b34b5f0d25862f5ef080",
};
import moment from "moment";
import areaData from "@/components/_utils/area-json.js";
import DepartPopup from "@/components/TopVUI/custom/DepartPopup";
import UploadImg from "@/components/TopVUI/k-form-design/packages/UploadImg";
import { getDicItemByCode } from "@/api/common.js";
let mapInstance = null;
export default {
  components: {
    DepartPopup,
    UploadImg,
  },
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    model: {
      type: Object,
      default: {},
    },
  },
  watch: {
    visible: {
      handler(val) {
        this.$emit("update:visible", val);
        if (val) {
          this.getData();
          if (this.model.text == "编辑") {
            this.getDetail();
          }
        }
      },
      immediate: true,
    },
  },
  data() {
    return {
      upLoadImgData: {
        //上传图片数据
        options: {
          uploadWay: "minio",
          width: "100%", //宽度
          drag: false, //是否可拖拽
          fileName: "file", //文件参数名
          multiple: false, //是否支持多选
          limit: 1, //上传最大数量
          disabled: false, //是否禁用
          data: "{}", //额外参数（json格式）
          listType: "picture-card", //上传列表的内建样式，支持三种基本样式 text, picture 和 picture-card
          action: "/document/minio/uploadfile", //上传请求地址
          headers: {}, //请求头部
          downloadWay: "a", //下载方式  可选a、ajax
          dynamicFun: "", //动态函数名
          placeholder: "上传", //上传区文字提示
          defaultValue: [], //默认值
        },
      },
      upLoadImgConfigData: {}, //上传图片数据
      loading: false,
      form: {
        //上级公司
        pid: "",
        //项目编码
        proCode: "",
        //项目名称
        proName: "",
        //分管主任
        groupDirector: "",
        //集团战略投资部分管主任
        strategicInvestmentDirector: "",
        //项目状态
        proStatus: undefined,
        //归属公司
        companyCode: undefined,
        //详细地址
        address: "",
        //项目所在地
        provinceCode: undefined,
        cityCode: undefined,
        areaCode: undefined,
        //计划开工日期
        startDate: "",
        //计划交工日期
        endDate: "",
        //实际开工日期
        realityStartDate: "",
        //实际交工日期
        realityEndDate: "",
        //项目属性
        proType: undefined,
        //工程类型
        engType: undefined,
        //公路类型
        roadType: undefined,
        //道路等级
        roadGrade: undefined,
        //建设里程
        roadKm: "",
        //区位
        workArea: undefined,
        //投资金额
        roadMoney: "",
        //投资规模
        raodMoneyScale: "",
        //X坐标
        geox: "",
        //Y坐标
        geoy: "",
        //项目简介
        introduction: "",
        //项目管理负责人
        contacts: "",
        //手机号
        contactsPhone: "",
        //项目图片
        proImage: [],
        //排序
        sort: "",
        //项目流程
        flowChart: undefined,
        //
        constructionUnit: "",
        //项目级别
        projectLevel: undefined,
        //建设性质
        constructionNature: undefined,
        //建设规模
        constructionScale: "",
        //项目单位
        projectUnit: undefined,
        //资金来源
        fundingSource: undefined,
        //管理部门
        managementDepartment: undefined,
      },
      rules: {
        pid: [{ required: true, message: "请选择上级公司", trigger: "change" }],
        proCode: [
          { required: true, message: "请输入项目编码", trigger: "blur" },
        ],
        proName: [
          { required: true, message: "请输入项目名称", trigger: "blur" },
        ],
        provinceCode: [
          { required: true, message: "请选择项目所在地", trigger: "change" },
        ],
        startDate: [
          { required: true, message: "请选择计划开工日期", trigger: "change" },
        ],
        endDate: [
          { required: true, message: "请选择计划交工日期", trigger: "change" },
        ],
        proType: [
          { required: true, message: "请选择项目属性", trigger: "change" },
        ],
        engType: [
          { required: true, message: "请选择工程类型", trigger: "change" },
        ],
        roadKm: [
          { required: true, message: "请输入建设里程", trigger: "blur" },
          {
            pattern: /(^[1-9]([0-9]+)?(\.[0-9]{1,3})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/,
            message: "请输入正确的建设里程，可保留三位小数",
          },
        ],
        workArea: [
          { required: true, message: "请选择区位", trigger: "change" },
        ],
        roadMoney: [
          { required: true, message: "请输入投资金额", trigger: "blur" },
          {
            pattern: /(^[1-9]([0-9]+)?(\.[0-9]{1,6})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/,
            message: "请输入正确的投资金额，可保留六位小数",
          },
        ],
        contactsPhone: [
          { required: false },
          {
            pattern: /^1[0-9]{10}$/,
            message: "请输入正确的手机号",
          },
        ],
        sort: [{ required: true, message: "请输入排序" }],
        groupDirector: [
          {
            required: true,
            message: "请输入集团工程技术部分管主任",
            trigger: "blur",
          },
        ],
        proStatus: [
          { required: true, message: "请选择项目状态", trigger: "change" },
        ],
        companyCode: [
          { required: false, message: "请选择归属公司", trigger: "change" },
        ],
        constructionUnit: [
          {
            required: true,
            message: "请输入建设单位",
            trigger: "blur",
          },
        ],
      },
      //地图
      map: {
        type: 1,
        keyWord: "",
        geox: "",
        geoy: "",
        marker: null,
      },
      mapModule: null,
      //项目属性
      projectTypeSource: [],
      //工程类型
      engTypeSource: [],
      //项目状态
      roadGradeSource: [],
      //省市区
      provinceSource: areaData,
      citySource: [],
      areaSource: [],
      //区位
      workAreaSource: [],
      //归属公司
      companySource: [],
      //项目流程
      flowSource: [],
      //项目级别
      levelSoucer: [],
      //建设性质
      natureSoucer: [],
      //项目单位
      unitSoucer: [],
      //资金来源
      fundingSource: [],
      //管理部门
      departmentSource: [],
    };
  },
  mounted() {},
  methods: {
    handleChange(e) {
      this.form.proImage = e;
    },

    selectContainer(triggerNode) {
      return triggerNode.parentNode;
    },

    //投资规模
    roadMoneyBlur() {
      let { roadMoney } = this.form;
      if (roadMoney < 5000 && roadMoney > 0) {
        this.form.raodMoneyScale = "5千万以下";
      } else if (roadMoney >= 5000 && roadMoney < 10000) {
        this.form.raodMoneyScale = "5千万-1亿";
      } else if (roadMoney >= 10000) {
        this.form.raodMoneyScale = "1亿以上";
      } else {
        this.form.raodMoneyScale = "";
      }
    },

    //详情
    getDetail() {
      let { sysProject } = this.model;
      let str = sysProject?.remark ?? "";
      let arr = str.split(",");
      let provCode = arr?.[0] ?? undefined;
      let cityCode = arr?.[1] ?? undefined;
      if (provCode) {
        this.citySource =
          this.provinceSource.find((item) => item.code == provCode)?.children ||
          [];
      }
      if (cityCode) {
        this.areaSource =
          this.citySource.find((item) => item.code == cityCode)?.children || [];
      }
      this.form = {
        pid: sysProject?.pid ?? "",
        //排序
        sort: sysProject?.sort ?? "",
        //项目编码
        proCode: sysProject?.proCode || "",
        //项目名称
        proName: sysProject?.proName || "",
        //项目所在地
        provinceCode: sysProject.provinceCode
          ? sysProject.provinceCode.toString()
          : undefined,
        cityCode: sysProject.cityCode
          ? sysProject.cityCode.toString()
          : undefined,
        areaCode: sysProject.areaCode
          ? sysProject.areaCode.toString()
          : undefined,
        //计划开工日期
        startDate: sysProject?.startDate || "",
        //计划交工日期
        endDate: sysProject?.endDate || "",
        //实际开工日期
        realityStartDate: sysProject?.realityStartDate ?? "",
        //实际交工日期
        realityEndDate: sysProject?.realityEndDate ?? "",
        //项目属性
        proType: sysProject?.proType || undefined,
        //工程类型
        engType: sysProject?.engType || undefined,
        //公路类型
        roadType: sysProject?.roadType || undefined,
        //道路等级
        roadGrade: sysProject?.roadGrade || undefined,
        //建设里程
        roadKm: sysProject?.roadKm || "",
        //区位
        workArea: sysProject?.workArea || undefined,
        //投资金额
        roadMoney: sysProject?.roadMoney || "",
        //投资规模
        raodMoneyScale: sysProject?.raodMoneyScale || "",
        //X坐标
        geox: sysProject?.geox || "",
        //Y坐标
        geoy: sysProject?.geoy || "",
        //项目简介
        introduction: sysProject?.introduction || "",
        //项目管理负责人
        contacts: sysProject?.contacts || "",
        //手机号
        contactsPhone: sysProject?.contactsPhone || "",
        //项目图片
        proImage: JSON.parse(sysProject?.proImage ?? "[]"),
        uuid: sysProject?.uuid,
        //分管主任
        groupDirector: sysProject?.groupDirector,
        //集团战略投资部分管主任
        strategicInvestmentDirector: sysProject?.strategicInvestmentDirector,
        //项目状态
        proStatus: sysProject?.proStatus ?? undefined,
        //归属公司
        companyCode: sysProject?.companyCode ?? undefined,
        //详细地址
        address: sysProject?.address,
        //项目流程
        flowChart: sysProject.flowChart ? sysProject.flowChart : undefined,
        //建设单位
        constructionUnit: sysProject?.constructionUnit ?? "",
        //项目级别
        projectLevel: sysProject?.projectLevel ?? undefined,
        //建设性质
        constructionNature: sysProject?.constructionNature ?? undefined,
        //建设规模
        constructionScale: sysProject?.constructionScale ?? "",
        //项目单位
        projectUnit: sysProject?.projectUnit ?? undefined,
        //资金来源
        fundingSource: sysProject?.fundingSource ?? undefined,
        //管理部门
        managementDepartment: sysProject?.managementDepartment ?? undefined,
      };
      //数据赋值 给img组件
      this.upLoadImgData.options.defaultValue = this.form?.proImage ?? [];
    },

    //提交
    onSubmit() {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          this.loading = true;
          let { form } = this;
          let formJson = {
            orgType: "org_type.04",
            pid: form.pid,
            //排序
            sort: form.sort,
            //项目编码
            proCode: form.proCode,
            //项目名称
            proName: form.proName,
            //项目所在地
            provinceCode: form.provinceCode ? form.provinceCode : "",
            cityCode: form.cityCode ? form.cityCode : "",
            areaCode: form.areaCode ? form.areaCode : "",
            remark: `${form.provinceCode},${form.cityCode},${form.areaCode}`,
            //计划开工日期
            startDate: form.startDate,
            //计划交工日期
            endDate: form.endDate,
            //实际开工日期
            realityStartDate: form.realityStartDate,
            //实际交工日期
            realityEndDate: form.realityEndDate,
            //项目属性
            proType: form.proType ? form.proType : "",
            //工程类型
            engType: form.engType ? form.engType : "",
            //公路类型
            roadType: form.roadType ? form.roadType : "",
            //道路等级
            roadGrade: form.roadGrade ? form.roadGrade : "",
            //建设里程
            roadKm: form.roadKm,
            //区位
            workArea: form.workArea,
            //投资金额
            roadMoney: form.roadMoney,
            //投资规模
            raodMoneyScale: form.raodMoneyScale,
            //X坐标
            geox: form.geox,
            //Y坐标
            geoy: form.geoy,
            //项目简介
            introduction: form.introduction,
            //项目管理负责人
            contacts: form.contacts,
            //手机号
            contactsPhone: form.contactsPhone,
            //项目图片
            proImage: JSON.stringify(form.proImage),
            //分管主任
            groupDirector: form.groupDirector,
            //集团战略投资部分管主任
            strategicInvestmentDirector: form?.strategicInvestmentDirector,
            //项目状态
            proStatus: form?.proStatus ?? "",
            //归属公司
            companyCode: form?.companyCode ?? "",
            //详细地址
            address: form.address,
            //项目流程
            flowChart: form?.flowChart ?? "",
            //建设单位
            constructionUnit: form?.constructionUnit ?? "",
            //项目级别
            projectLevel: form?.projectLevel ?? "",
            //建设性质
            constructionNature: form?.constructionNature ?? "",
            //建设规模
            constructionScale: form?.constructionScale ?? "",
            //项目单位
            projectUnit: form?.projectUnit ?? "",
            //资金来源
            fundingSource: form?.fundingSource ?? "",
            //管理部门
            managementDepartment: form?.managementDepartment ?? "",
          };
          let url = "";
          //编辑
          if (form.uuid) {
            formJson.uuid = form.uuid;
            url = "/mdata/organization/updateProject";
          }
          //新增
          else {
            url = "/mdata/organization/saveProject";
          }
          axios
            .post(url, formJson, {
              headers: {
                "Content-Type": "application/json",
              },
            })
            .then((res) => {
              this.$message.success(
                res.message ? res.message : "操作成功",
                1.5
              );
              this.closeModal();
              this.$parent.getTreeProjectData();
              this.$parent.getTableData();
            })
            .catch((_) => {})
            .finally((_) => {
              this.loading = false;
            });
        }
      });
    },

    //查询所有下拉框
    async getData() {
      //获取项目状态
      this.roadGradeSource = await this.getDicCodeDate("proStatus");
      //获取工程类型
      this.engTypeSource = await this.getDicCodeDate("engineeringType");
      //获取归属公司
      await this.getCompanyData();
      //获取项目属性
      this.projectTypeSource = await this.getDicCodeDate("projectType");
      //获取区位
      this.workAreaSource = await this.getDicCodeDate("workArea");
      //获取项目流程
      await this.getProjectFlow();
      //获取项目等级
      this.levelSoucer = await this.getDicCodeDate("projectLevel");
      //获取建设性质
      this.natureSoucer = await this.getDicCodeDate("constructionNature");
      //获取项目单位
      this.unitSoucer = await this.getDicCodeDate("projectUnit");
      //获取资金来源
      this.fundingSource = await this.getDicCodeDate("fundingSource");
      //获取管理部门
      this.departmentSource = await this.getDicCodeDate("managementDepartment");
    },

    //查询字典表
    getDicCodeDate(dicCode = "") {
      return new Promise((resolve, reject) => {
        getDicItemByCode({ code: dicCode })
          .then((res) => {
            let { data } = res;
            resolve(data);
          })
          .catch((_) => {
            reject();
          })
          .finally((_) => {});
      });
    },

    //查询归属公司
    getCompanyData() {
      this.$get("/mdata/organization/getCompanyList", {})
        .then((res) => {
          this.companySource = res?.data ?? [];
        })
        .catch((_) => {
          this.companySource = [];
        });
    },

    //查询项目流程
    getProjectFlow() {
      axios
        .post(
          "/probusiness/projectProcess/getListByStatus?status=2",
          {},
          {
            headers: {
              "Content-Type": "application/json",
            },
          }
        )
        .then((res) => {
          this.flowSource = res?.data ?? [];
        })
        .catch((_) => {
          this.flowSource = [];
        })
        .finally((_) => {});
    },

    //选择省
    provinceChange(e) {
      this.form.cityCode = undefined;
      this.form.areaCode = undefined;
      this.form.areaCode = [];
      this.citySource =
        this.provinceSource.find((item) => item.code == e)?.children || [];
    },

    //选择市
    cityChange(e) {
      this.form.areaCode = undefined;
      this.areaSource =
        this.citySource.find((item) => item.code == e)?.children || [];
    },

    //初始化地图
    initMap(geox = "", geoy = "") {
      AMapLoader.load({
        key: "4a9b32384ac2ef8437f61e2357874137", // 申请好的Web端开发者Key，首次调用 load 时必填
        version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
        plugins: [
          "AMap.Scale",
          "AMap.ToolBar",
          "AMap.ControlBar",
          "AMap.MouseTool",
          "AMap.MapType",
          "AMap.HawkEye",
          "AMap.Geolocation",
          "AMap.Geocoder",
          "AMap.PlaceSearch",
          "AMap.AutoComplete",
        ], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
      })
        .then((AMap) => {
          this.mapModule = AMap;
          mapInstance = new AMap.Map("project-map", {
            zoom: 15, //初始化地图级别
            center: [
              geox ? geox : 119.37094691782585,
              geoy ? geoy : 34.74193028641671,
            ],
            resizeEnable: true,
          });
          //编辑回显地理坐标
          if (geox && geoy) {
            this.addMapMarker(new AMap.LngLat(geox, geoy));
          }
          mapInstance.on("click", (e) => {
            //点击地图 获取坐标
            this.form.geox = e.lnglat.lng; //经度
            this.form.geoy = e.lnglat.lat; //纬度
            this.addMapMarker(e.lnglat);
          });
        })
        .catch((e) => {});
    },

    //地图搜索
    serachMap() {
      var _this = this;
      if (_this.map.type == 2) {
        if (!_this.map.geox || !_this.map.geoy) return;
        _this.addMapMarker(
          new _this.mapModule.LngLat(_this.map.geox, _this.map.geoy)
        );
        mapInstance.setCenter([_this.map.geox, _this.map.geoy]);
        _this.form.geox = _this.map.geox;
        _this.form.geoy = _this.map.geoy;
        return;
      }
      if (!_this.map.keyWord) return;
      var placeSearch = new _this.mapModule.PlaceSearch({
        city: "全国",
        autoFitView: true,
      });
      placeSearch.search(_this.map.keyWord, function(status, result) {
        if (status == "complete") {
          if (result.poiList.pois.length == 0) {
            return;
          }
          _this.addMapMarker(result.poiList.pois[0].location);
          _this.form.geox = result.poiList.pois[0].location.lng;
          _this.form.geoy = result.poiList.pois[0].location.lat;
        }
        mapInstance.setFitView();
      });
    },

    //添加自定义点标记
    addMapMarker(LngLat) {
      if (this.map.marker) {
        mapInstance.remove(this.map.marker);
      }
      this.map.marker = new AMap.Marker({
        position: LngLat,
      });
      mapInstance.add(this.map.marker);
    },

    //判断维结束时间大于完工时间
    disabledStartDate(current) {
      if (this.form.startDate == null && this.form.endDate == null) {
        return;
      }
      return current >= moment(this.form.endDate).endOf("day");
    },

    disabledEndDate(current) {
      if (this.form.startDate == null && this.form.endDate == null) {
        return;
      }
      return current <= moment(this.form.startDate).endOf("day");
    },

    //关闭弹窗
    closeModal() {
      this.resetForm();
      this.$emit("update:visible", false);
    },

    //重置表单
    resetForm() {
      this.upLoadImgData.options.defaultValue = [];
      this.map = {
        type: 1,
        keyWord: "",
        geox: "",
        geoy: "",
        marker: null,
      };
      this.form = {
        //上级公司
        pid: "",
        //项目编码
        proCode: "",
        //项目名称
        proName: "",
        //分管主任
        groupDirector: "",
        //集团战略投资部分管主任
        strategicInvestmentDirector: "",
        //项目状态
        proStatus: undefined,
        //归属公司
        companyCode: undefined,
        //详细地址
        address: "",
        //项目所在地
        provinceCode: undefined,
        cityCode: undefined,
        areaCode: undefined,
        //计划开工日期
        startDate: "",
        //计划交工日期
        endDate: "",
        //实际开工日期
        realityStartDate: "",
        //实际交工日期
        realityEndDate: "",
        //项目属性
        proType: undefined,
        //工程类型
        engType: undefined,
        //公路类型
        roadType: undefined,
        //道路等级
        roadGrade: undefined,
        //建设里程
        roadKm: "",
        //区位
        workArea: undefined,
        //投资金额
        roadMoney: "",
        //投资规模
        raodMoneyScale: "",
        //X坐标
        geox: "",
        //Y坐标
        geoy: "",
        //项目简介
        introduction: "",
        //项目管理负责人
        contacts: "",
        //手机号
        contactsPhone: "",
        //项目图片
        proImage: [],
        //排序
        sort: "",
        //项目流程
        flowChart: undefined,
        //
        constructionUnit: "",
        //项目级别
        projectLevel: undefined,
        //建设性质
        constructionNature: undefined,
        //建设规模
        constructionScale: "",
        //项目单位
        projectUnit: undefined,
        //资金来源
        fundingSource: undefined,
        //管理部门
        managementDepartment: undefined,
      };
      this.$refs.ruleForm.resetFields();
    },

    //select 搜索过滤
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text
          .toLowerCase()
          .indexOf(input.toLowerCase()) >= 0
      );
    },
  },
};
</script>

<style lang="less" scoped>
@primary-color: @primary-color;
/deep/.add-modal-container {
  .ant-modal-body {
    padding: 0 !important;
  }
  .ant-modal-header {
    position: relative;
    .ant-modal-title {
      &::before {
        content: "";
        position: absolute;
        top: 18px;
        left: 10px;
        background-color: @primary-color;
        height: 17px;
        width: 5px;
      }
    }
  }
  .curve-modal-body {
    padding: 14px;
    max-height: 630px;
    overflow: auto;
    .sub-title {
      font-weight: 700;
      font-size: 16px;
      color: #111111;
      letter-spacing: 1px;
      margin-bottom: 10px;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .ant-divider {
      margin: 10px 0;
    }
  }
  .curve-modal-footer {
    padding: 10px 16px;
    display: flex;
    justify-content: flex-end;
    border-top: 1px solid #e8e8e8;
    border-radius: 0 0 4px 4px;
    button {
      &:last-child {
        margin-left: 20px;
      }
    }
  }
  .ant-form-item {
    display: flex;
    .ant-form-item-label {
      flex-shrink: 0;
      width: 110px;
      white-space: pre-wrap;
      display: flex;
      justify-content: flex-end;
      line-height: 20px;
      margin-right: 2px;
      align-items: center;
      height: 36px;
    }
    .ant-form-item-control-wrapper {
      flex: 1;
    }
  }
  .map-container {
    width: 100%;
    height: 340px;
    position: relative;
    box-sizing: border-box;
    border: 2px solid #fff;
    border-radius: 4px;
    .search-wrap {
      width: 351px;
      position: absolute;
      left: 10px;
      top: 10px;
      right: 10px;
      background: #ffffff;
      box-shadow: 0px 2px 3px 0px rgba(93, 93, 93, 0.34);
      border-radius: 4px;
      padding: 0 16px 12px;
    }
    .input-container {
      width: 100%;
      height: 30px;
      border-radius: 4px;
      overflow: hidden;
      background: #ffffff;

      display: flex;
      .input-body {
        flex: 1;
        border: 1px solid #d4d7d8;
        border-radius: 4px 0px 0px 4px;
        display: flex;
      }
      .ant-input {
        flex: 1;
        height: 28px;
        border-radius: 0;
        border: 0;
        margin: 0;
      }
      .ant-input:focus {
        box-shadow: 0 0 0;
      }
      .search {
        width: 60px;
        height: 30px;
        background: rgb(49, 131, 255);
        border: 1px solid rgb(49, 131, 255);
        border-radius: 0px 4px 4px 0px;
        text-align: center;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
      }
    }
    #project-map {
      height: 100%;
      width: 100%;
    }
  }
}
</style>
